<template>
	<view class="information">
		<view class="title">{{ dataInfo.title }}</view>
		<view class="time">发布时间:{{ dataInfo.gmtCreate }}</view>
		<view class="content">
			<rich-text :nodes="dataInfo.content"></rich-text>
		</view>
	</view>
</template>

<script>
	import { newsGetId } from '@/api/home'
	export default {
		name: 'information',
		data() {
			return {
				dataInfo: {}
			}
		},
		onLoad(option) {
			console.log(option)
			this.getData(option.id)
		},
		methods: {
			getData(id) {
				newsGetId({ id: id  }).then(res => {
					console.log(res)
					this.dataInfo = res.data;
					this.dataInfo.content = this.dataInfo.content.replace(/<img.*?>/, function(item){
						if(item.includes('style=')){
								return item.replace(/style="(.*?)(?=\")/, 'style="$1 '+ `width:100%;height:auto;`);
						}else{
								return item.replace(/\<img (.*?)(?=\")/, '<img style="'+ `width:100%;height:auto;` + '" $1');
						}
					})
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.information {
		padding: 30rpx 40rpx;
		box-sizing: border-box;
		.title {
			text-align: center;
			font-size: 32rpx;
			font-weight: bold;
			color: #000;
		}
		.time {
			margin-top: 20rpx;
			text-align: right;
			font-size: 26rpx;
			color: #212121;
		}
		.content {
			margin-top: 30rpx;
			word-break: break-all;
			word-wrap: break-word;
			text-align: justify;
		}
	}
</style>
